<template>
    <view>
        <view class="main">
            <view class="table">
                <uni-table border :emptyText="$lang('暂无数据')">
                    <uni-tr class="tableHead">
                        <uni-th align="center" v-for="(item,index) in tableColumn" :key="index">{{$lang(item.label)}}</uni-th>
                        <uni-th align="center">{{$lang('操作')}}</uni-th>
                    </uni-tr>
                    <uni-tr v-for="(item,index) in tableData" :key="index">
                        <uni-td align="center" v-for="(data,dataIndex) in tableColumn" :key="dataIndex">
                            <text v-if="data.value == 'index'">{{index + 1}}</text>
                            <view v-else-if="data.value == 'image'">
                                <image :src="baseUrl + item[data.value]" style="width: 100rpx;height: 100rpx;"></image>
                            </view>
                            <text v-else>{{item[data.value]}}</text>
                        </uni-td>
                        <uni-td align="center">
                            <view class="uni-group">
                                <button class="text-btn" size="mini" type="primary" v-if="item.status == 1" @click="$common.go(1,`/pages/purchase/planTime?id=${item.id}`)">{{$lang('计划排产时间')}}</button>
                                <button class="text-btn" size="mini" type="primary">{{$lang('组装单')}}</button>
                                <button class="text-btn" size="mini" type="primary" v-if="item.status == 2">{{$lang('入库')}}</button>
                            </view>
                        </uni-td>
                    </uni-tr>
                </uni-table>
                <view class="pagination">
                    <uni-pagination :show-icon="true" :total="total" title="" @change="currentChange" />
                </view>
            </view>
        </view>
    </view>
</template>

<script>
    import {
        produceList,
        localChangeRed
    } from '../../api/api'
    export default {
        data() {
            return {
                formInline:{
                    page:1,
                    start_time:'',
                    end_time:'',
                    status:'',
                    type:'',
                    goods_code:'',
                    code:'',
                },
                tableData:[],
                tableColumn:[
                    {label:this.$lang('序号'),value:'index'},
                    {label:this.$lang('状态'),value:'statusName'},
                    {label:this.$lang('客户名称'),value:'customer'},
                    {label:this.$lang('商品总金额'),value:'goods_money'},
                    {label:this.$lang('订单号'),value:'order_no'},
                    {label:this.$lang('是否需要量尺'),value:'is_measureName'},
                    {label:this.$lang('期望配送时间'),value:'delivery_time'},
                    {label:this.$lang('计划排产时间'),value:'plan_generator_time'},
                    {label:this.$lang('组装时间'),value:'assemble_time'},
                    {label:this.$lang('入库时间'),value:'store_time'},
                    {label:this.$lang('量尺详情'),value:'measure_file'},
                    {label:this.$lang('店铺名称'),value:'shopName'},
                ],
                baseUrl:'',
                total:0,
                statusBarHeight:0,
                statusList:[
                    {label:this.$lang('待排产'),value:1},
                    {label:this.$lang('生产中'),value:2},
                    {label:this.$lang('已完成'),value:3},
                ],
                selectData:[],
                tomorrow_num:0
            }
        },
        onLoad() {
            uni.setNavigationBarTitle({
                title: this.$lang('明天计划排产')
            });
            this.baseUrl = this.$config.baseUrl;
            this.statusBarHeight = uni.getSystemInfoSync().statusBarHeight;
            this.getList();
        },
        methods: {
            getTomorrowDate() {
                const today = new Date();
                const tomorrow = new Date(today);
                tomorrow.setDate(today.getDate() + 1);

                const year = tomorrow.getFullYear();
                const month = String(tomorrow.getMonth() + 1).padStart(2, '0'); // 月份从0开始，需要+1
                const day = String(tomorrow.getDate()).padStart(2, '0');

                return `${year}-${month}-${day}`;
            },
            localChangeRedFun(item){
                uni.showModal({
                    title: this.$lang('提示'),
                    content: this.$lang('确定要红冲吗' + '？'),
                    cancelText:this.$lang('取消'),
                    confirmText:this.$lang('确定'),
                    success: (res) => {
                        if (res.confirm) {
                            localChangeRed({
                                id:item.factory_purchaser.id
                            }).then(res => {
                                if(res.code == 1){
                                    uni.showToast({
                                        title:this.$lang('红冲操作成功'),
                                        icon:'none'
                                    });
                                    this.getList();
                                }
                            })
                        } else if (res.cancel) {
                            console.log('用户点击取消');
                        }
                    }
                });
            },
            packContain(){
                if(this.selectData.length == 0){
                    return uni.showToast({
                        title:this.$lang('请先选择需要打包装柜的商品'),
                        icon:'none'
                    });
                }
                this.$common.go(1,`/pages/purchase/packContain?ids=${JSON.stringify(this.selectData)}`)
            },
            selectionChange(e){
                let selectData = []
                e.detail.index.forEach(item => {
                    this.tableData.forEach((data,dataIndex) => {
                        if(item == dataIndex){
                            selectData.push(data.id);
                        }
                    })
                });
                this.selectData = selectData;
            },
            suppleInfo(){
                if(this.selectData.length == 0){
                    return uni.showToast({
                        title:this.$lang('请先选择需要补充发货信息的商品'),
                        icon:'none'
                    });
                }
                this.$common.go(1,`/pages/purchase/suppleInfo?ids=${JSON.stringify(this.selectData)}`)
            },
            filterRest(){
                this.formInline = {
                    page:1,
                    start_time:'',
                    end_time:'',
                    status:'',
                    type:'',
                    goods_code:'',
                    code:'',
                }
            },
            filterSubmit(){
                this.formInline.page = 1;
                this.getList();
                this.$refs.showRight.close();
            },
            showDrawer() {
                this.$refs.showRight.open();
            },
            currentChange(e){
                this.formInline.page = e.current;
                this.getList();
            },
            getList(){
                this.formInline.start_time = this.getTomorrowDate();
                this.formInline.end_time = this.getTomorrowDate();
                produceList(this.formInline).then(res => {
                    this.tomorrow_num = res.data.tomorrow_num;
                    this.tableData = res.data.list.data;
                    this.total = res.data.total
                    this.tableData.forEach(item => {
                        if(item.status == 1){
                            item.statusName = '待排产';
                        } else if(item.status == 2){
                            item.statusName = '生产中';
                        } else if(item.status == 3){
                            item.statusName = '已完成';
                        }
                        if(item.is_measure == 1){
                            item.is_measureName = '需要'
                        } else if(item.is_measure == 2){
                            item.is_measureName = '不需要';
                        }
                        item.delivery_time = item.delivery_time ? this.$common.formatDate(item.delivery_time * 1000) : '';
                        item.plan_generator_time = item.plan_generator_time ? this.$common.formatDate(item.plan_generator_time * 1000) : '';
                        item.assemble_time = item.assemble_time ? this.$common.formatDate(item.assemble_time * 1000) : '';
                        item.store_time = item.store_time ? this.$common.formatDate(item.store_time * 1000) : '';
                        item.shopName = item.shop ? item.shop.shop_name : '';
                        this.$forceUpdate();
                    })
                })
            }
        }
    }
</script>
<style>
    page{
        background: #f5f5f5;
    }
</style>
<style lang="scss" scoped>
    .main{
        padding: 27rpx 24rpx;
        .searchFilter{
            display: flex;
            align-items: center;
            justify-content: space-between;
            .fl{
                width: 580rpx;
                height: 70rpx;
                border-radius: 70rpx;
                border: 1px solid #c3ddf7;
                background: #fff;
                display: flex;
                align-items: center;
                .icon{
                    width: 36rpx;
                    height: 31rpx;
                    padding: 0 30rpx 0 37rpx;
                    position: relative;
                    image{
                        width: 100%;
                        height: 100%;
                    }
                    &:after{
                        content: '';
                        display: block;
                        width: 1px;
                        height: 29rpx;
                        background: #d2d2d2;
                        position: absolute;
                        right: 0;
                        top: 50%;
                        transform: translateY(-50%);
                    }
                }
                input{
                    flex:1;
                    padding: 0 25rpx;
                    font-size: 24rpx;
                }
            }
            .fr{
                padding: 0 26rpx 0 15rpx;
                height: 52rpx;
                border-radius: 5rpx;
                line-height: 52rpx;
                font-size: 26rpx;
                color: #365aa6;
                position: relative;
                background: #fff;
                image{
                    width: 20rpx;
                    height: 21rpx;
                    position: absolute;
                    right: 6rpx;
                    bottom: 6rpx;
                }
            }
        }
        .table{
            /*margin-top: 30rpx;*/
        }
    }
    .footer{
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        padding: 24rpx 24rpx 45rpx 24rpx;
        background: #f5f5f5;
        .top{
            display: flex;
            align-items: center;
            justify-content: space-between;
            .fl{
                width: 339rpx;
                height: 90rpx;
                border-radius: 90rpx;
                text-align: center;
                line-height: 90rpx;
                font-size: 36rpx;
                color: #555;
                border: 1px solid #c9c9c9;
                background: #eee;
            }
            .fr{
                width: 339rpx;
                height: 90rpx;
                border-radius: 90rpx;
                text-align: center;
                line-height: 90rpx;
                background: #fff;
                border: 1px solid #27417d;
                color: #163273;
                font-size: 36rpx;
            }
        }
        .btm{
            height: 90rpx;
            border-radius: 90rpx;
            text-align: center;
            line-height: 90rpx;
            background: #365aa6;
            font-size: 36rpx;
            color: #fff;
            margin-top: 27rpx;
        }
    }
    .filterTitle{
        height: 80rpx;
        border-bottom: 1px solid #eee;
        text-align: center;
        font-size: 32rpx;
        color: #222;
    }
    .filterList{
        padding: 0 25rpx;
        .li{
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding-top: 30rpx;
            .fl{
                width: 200rpx;
            }
            .fr{
                position: relative;
                flex: 1;
                /deep/ .uni-stat__select{
                    .uni-select{
                        font-size: 32rpx;
                        border-color: #757575;
                        border-radius: 8rpx;
                        padding: 0 25rpx;
                        height: 90rpx;
                        .uni-select__input-box{
                            height: 100%;
                            .uni-select__input-text{
                                font-size: 32rpx;
                            }
                            .uni-icons{
                                font-size: 32rpx;
                                color: #757575;
                            }
                        }
                    }
                }
                input{
                    font-size: 32rpx;
                    border: 1px solid #757575;
                    border-radius: 8rpx;
                    padding: 0 25rpx;
                    height: 90rpx;
                }
                /deep/ .uni-date{
                    .uni-date-picker__container{
                        position: absolute;
                        left: -50%;
                        .uni-popper__arrow{
                            left: 50%;
                        }
                    }
                    .uni-date-x--border{
                        border-color: #757575;
                        border-radius: 8rpx;
                        .uni-date-x{
                            border-radius: 8rpx;
                            font-size: 32rpx;
                            .uni-icons{
                                font-size: 40rpx !important;
                                color: #365aa6 !important;
                            }
                            .uni-date__x-input{
                                height: 90rpx;
                                line-height: 90rpx;
                                font-size: 32rpx;
                                margin-left: 12rpx;
                            }
                        }
                    }
                }
            }
        }
    }
    .drawerBtn{
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 25rpx;
        .fl{
            width: 260rpx;
            height: 90rpx;
            line-height: 90rpx;
            background: #fff;
            border: 1px solid #bababa;
            text-align: center;
            border-radius: 90rpx;
            font-size: 36rpx;
            color: #363636;
        }
        .fr{
            width: 260rpx;
            height: 90rpx;
            line-height: 90rpx;
            background: #365aa6;
            border: 1px solid #365aa6;
            text-align: center;
            border-radius: 90rpx;
            font-size: 36rpx;
            color: #fff;
        }
    }
    .plan{
        display: flex;
        align-items: center;
        justify-content: space-between;
        border: 1px solid #fbc1a3;
        background: #fef1eb;
        height: 65rpx;
        padding: 0 25rpx;
        margin: 20rpx 0;
        border-radius: 10rpx;
        .fl{
            font-size: 28rpx;
            color: #f55200;
            image{
                width: 36rpx;
                height: 30rpx;
                margin-right: 20rpx;
                vertical-align: middle;
            }
        }
        .fr{
            font-size: 24rpx;
            color: #f55200;
            image{
                width: 12rpx;
                height: 20rpx;
                margin-left: 15rpx;
                vertical-align: middle;
            }
        }
    }
</style>
